<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>selector</title>
	<style>
		div{
			width: 100px;
			height: 100px;
			background-color: red;
			margin:10px;
		}


		/*#two{
			background-color: blue;
		}*/

		/*.one{
			background-color: blue
		}*/

		/**{
			margin:0px;
			padding:0px;
		}*/

		/*#outer li{
			border:1px solid red;
		}*/

		/*#one~div{
			background-color: blue
		}*/

		[class*='w']{
			background-color: orange;
		}

	</style>
</head>
<body>
	<div id="one" class="one"></div>
	<div id="two" class="one two"></div>
	<div class="two"></div>
	<div class="two three"></div>
	<div id='five' class="one"></div>
	<ul id="outer">
		<li>outer1
			<ul>
				<li>inner</li>
			</ul>
		</li>
		<li>outer2</li>
		<li>outer3</li>
	</ul>
</body>
</html>










